const addCustomerBtn = document.getElementById('addCustomerBtn')
const customerModal = document.getElementById('customerModal')
const closeBtn = document.getElementsByClassName('close-btn')


addCustomerBtn.addEventListener('click', () => {
    customerModal.style.display = "flex"

    for (let i = 0; i < closeBtn.length; i++) {
        closeBtn.item(i).addEventListener('click', () => {
            customerModal.style.display = "none"
        })
    }
})

const searchInput = document.getElementById('searchInput')

searchInput.addEventListener('keyup', (e) => {
    if (e.key === 'Enter') {
        window.location.href = `/products?current=0&page=10&name=` + searchInput.value;
    }
})

document.addEventListener('DOMContentLoaded', function() {
    // 获取所有编辑按钮
    const editButtons = document.querySelectorAll('.edit-btn');

    editButtons.forEach(button => {
        button.addEventListener('click', function() {
            // 获取产品数据属性
            const productId = this.getAttribute('data-id');
            const productName = this.getAttribute('data-name');
            const productSize = this.getAttribute('data-size');
            const productThickness = this.getAttribute('data-thickness');
            const productPrice = this.getAttribute('data-price');
            const productAddress = this.getAttribute('data-address');

            // 获取模态框元素
            const modal = document.getElementById('customerModal');
            const form = document.getElementById('customerForm');

            // 设置模态框标题
            document.getElementById('modalTitle').textContent = '编辑产品';

            // 填充表单数据
            form.querySelector('input[name="productName"]').value = productName || '';
            form.querySelector('input[name="size"]').value = productSize || '';
            form.querySelector('input[name="thickness"]').value = productThickness || '';
            form.querySelector('input[name="price"]').value = productPrice || '';
            form.querySelector('input[name="address"]').value = productAddress || '';

            // 设置隐藏的ID字段（如果需要）
            // 假设你有一个隐藏的input来存储ID
            const hiddenInput = form.querySelector('input[type="hidden"]');
            if (hiddenInput) {
                hiddenInput.name = 'id';
                hiddenInput.value = productId;
            }

            // 显示模态框
            modal.style.display = 'flex';
        });
    });

    // 关闭模态框的逻辑
    const closeButtons = document.querySelectorAll('.close-btn');
    closeButtons.forEach(button => {
        button.addEventListener('click', function() {
            document.getElementById('customerModal').style.display = 'none';

        });
    });
});